<template>
  <div class="swipe">
    <van-swipe :autoplay="3000">
      <van-swipe-item v-for="(image, index) in swipelist" :key="index">
        <img v-lazy="image.bannerUrl" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
import { swipe } from "@/utils/api";
export default {
  data() {
    return {
      swipelist: [],
    };
  },
  mounted() {
    swipe().then((res) => {
      console.log(res.data.list);
      this.swipelist = res.data.list;
    });
  },
};
</script>

<style lang="scss" scoped>
.swipe{
    margin: .4rem;
    .my-swipe .van-swipe-item {
      color: #fff;
      font-size: .5333rem;
      line-height: 4rem;
      text-align: center;
      background-color: #39a9ed;
    }
    .van-swipe-item{
        width: 100%;
        height: 4rem;
        img{
            width: 100%;
            height: 100%;
            border-radius: .2667rem;
        }
    }
}

</style>